<template>
	<view>
		<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="text"
			activeColor="#e54d42"></uni-segmented-control>
		<view class="margin-sm padding-sm">
			<view v-show="current === 0">
				<view v-for="item in 30" class="margin-bottom">
					<view style="display: flex;  justify-content: space-between;">
						<view class="font-title font-34rpx">{{item*100}}元</view>
						<view class="font-content font-12">2020-1-1 20:20:20</view>
					</view>
					<view style="display: flex;  justify-content: space-between;border-bottom: 1px solid #e9e9e9;">
						<view class="font-content font-12">描述描述描述</view>
						<view class="font-content font-12">描述描述描述元</view>
					</view>
				</view>
			</view>
			<view v-show="current === 1">
				<view v-for="item in 30" class="margin-bottom">
					<view style="display: flex;  justify-content: space-between;">
						<view class="font-title font-34rpx">{{item*100}}元</view>
						<view class="font-content font-12">2020-1-1 20:20:20</view>
					</view>
					<view style="display: flex;  justify-content: space-between;border-bottom: 1px solid #e9e9e9;">
						<view class="font-content font-12">描述描述描述</view>
						<view class="font-content font-12">描述描述描述元</view>
					</view>
				</view>
			</view>
			<view v-show="current === 2">
				<view v-for="item in 30" class="margin-bottom">
					<view style="display: flex;  justify-content: space-between;">
						<view class="font-title font-34rpx">{{item*100}}元</view>
						<view class="font-content font-12">2020-1-1 20:20:20</view>
					</view>
					<view style="display: flex;  justify-content: space-between;border-bottom: 1px solid #e9e9e9;">
						<view class="font-content font-12">描述描述描述</view>
						<view class="font-content font-12">描述描述描述元</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {

				items: ['全部', '充值', '消费', '退款'],
				current: 0
			};
		},

		methods: {

			onClickItem(e) {
				if (this.current != e.currentIndex) {
					this.current = e.currentIndex;
				}
			}
		}
	};
</script>
<style>
	page {
		background-color: white;
	}
</style>